<template>
  <div class="container">
    <el-row style="background-color: #fff;margin-bottom: 12px;">
      <parking-space-form @parkBoolean="receivePark"
                          @roadBoolean="receiveRoad"
                          @tableLoad="setTableLoad"
                          @tableData="getTableData"
                          :ranNum="ranNum"
                          :park="parkName"
                          :road="roadName"
                          :pageNum="pageNum"
                          :pageSize="pageSize"></parking-space-form>
    </el-row>
    <el-row style="background-color: #fff">
      <parking-space-table @addBerth="openAdd"
                           @editBerth="openEdit"
                           @pageNum="setPageNum"
                           @pageSize="setPageSize"
                           @delSearch="tiggerSearch"
                           :tableLoad="tableLoad"
                           :tableData="tableData"></parking-space-table>
    </el-row>
    <parking-dialog :parkLoading.sync="parkLoading"
                    :parkingVisible.sync="dialogParkVisible"
                    @parkName="selectParkName"></parking-dialog>
    <person-child-dialog-road :dialogRoadVisible.sync="dialogRoadVisible"
                              :roadLoading.sync="roadLoading"
                              @roadName="selectRoadName"></person-child-dialog-road>
    <parking-space-add :addBerthVisible.sync="addBerthVisible"
                       :parkName2.sync="parkName2"
                       :roadName2.sync="roadName2"
                       @openParkAdd="receivePark2"
                       @openRoadAdd="receiveRoad2"></parking-space-add>
    <parking-space-edit :editBerthVisible.sync="editBerthVisible"
                        :parkName3.sync="parkName3"
                        :editData="editData"
                        :roadName3.sync="roadName3"
                        @editSearch="tiggerSearch"
                        @openParkEdit="receivePark3"
                        @openRoadEdit="receiveRoad3"></parking-space-edit>
  </div>
</template>
<script>
  import ParkingSpaceForm from './parkingResourceChild/parkingSpaceForm'
  import ParkingDialog from '../operatingManagement/parkingflowChild/parkingDialog'
  import PersonChildDialogRoad from '../organizationManagement/personChild/personChildDialogRoad'
  import ParkingSpaceTable from './parkingResourceChild/parkingSpaceTable'
  import ParkingSpaceAdd from './parkingResourceChild/parkingSpaceAdd'
  import ParkingSpaceEdit from './parkingResourceChild/parkingSpaceEdit'
  export default {
    components: { ParkingSpaceEdit, ParkingSpaceAdd, ParkingSpaceTable, PersonChildDialogRoad, ParkingDialog, ParkingSpaceForm },
    data() {
      return {
        tableData: {},
        editData: [],
        pageNum: 1,
        pageSize: 10,
        tableLoad: false,
        dialogParkVisible: false,
        dialogRoadVisible: false,
        addBerthVisible: false,
        editBerthVisible: false,
        parkLoading: false,
        roadLoading: false,
        ranNum: 0,
        parkType: 0,
        roadType: 0,
        parkName: '',
        parkName2: '',
        parkName3: '',
        roadName: '',
        roadName2: '',
        roadName3: ''
      }
    },
    methods: {
      receivePark: function(val) {
        this.parkType = 1
        this.parkLoading = val
        this.dialogParkVisible = val
      },
      receivePark2: function(val) {
        this.parkType = 2
        this.parkLoading = val
        this.dialogParkVisible = val
      },
      receivePark3: function(val) {
        this.parkType = 3
        this.parkLoading = val
        this.dialogParkVisible = val
      },
      receiveRoad: function(val) {
        this.roadType = 1
        this.roadLoading = val
        this.dialogRoadVisible = val
      },
      receiveRoad2: function(val) {
        this.roadType = 2
        this.roadLoading = val
        this.dialogRoadVisible = val
      },
      receiveRoad3: function(val) {
        this.roadType = 3
        this.roadLoading = val
        this.dialogRoadVisible = val
      },
      selectParkName: function(val) {
        if (this.parkType === 1) {
          this.parkName = val
        } else if (this.parkType === 2) {
          this.parkName2 = val
        } else if (this.parkType === 3) {
          this.parkName3 = val
        } else {
          console.log()
        }
      },
      selectRoadName: function(val) {
        if (this.roadType === 1) {
          this.roadName = val
        } else if (this.roadType === 2) {
          this.roadName2 = val
        } else if (this.roadType === 3) {
          this.roadName3 = val
        } else {
          console.log()
        }
      },
      openAdd: function(val) {
        this.addBerthVisible = val
      },
      openEdit: function(val) {
        this.editData = val[0]
        this.editBerthVisible = val[1]
      },
      /* 执行完操作后触发查询 */
      tiggerSearch: function(val) {
        this.ranNum = val
      },
      setPageNum: function(val) {
        this.pageNum = val
      },
      setPageSize: function(val) {
        this.pageSize = val
      },
      setTableLoad: function(val) {
        this.tableLoad = val
      },
      getTableData: function(val) {
        this.tableData = val
      }
    }
  }
</script>
<style scoped>
  .container{
    padding-top: 16px;
    margin-left: 42px;
    margin-right: 42px;
  }
</style>
